<template>
  <div>
    <!--条件筛选-->
    <TopFilter :list="topFilterList" :cols="4" labelWidth="85" @filterChange="changeHandle" @onCollapse="collapseHandle"></TopFilter>
    <!--操作 -->
    <button-area :style="{ paddingLeft: '80px' }"></button-area>
    <!-- 列筛选-->
    <!-- :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'rows'" -->
    <FilterTable
      ref="table"
      columnsRef="partInventoryManagerAttachmentListIndex"
      :columns="columns"
      :dataSource="tableData"
      :isMemoryPagination="true"
      :onColumnsChange="columns => (this.columns = columns)"
      :onSyncTableData="getTableData"
      :onRowSelectChange="getSelectedData"
      :defaultSelections="defaultSelections"
    >
      <!-- :dataSource="dataSource" -->
      <template slot="controls">
        <!-- <el-button size="small" type="primary" @click="selectAll">全选</el-button> -->
        <!-- <AjaxButton size="small" type="primary" :click="cancelAll">全消</AjaxButton> -->
        <AjaxButton size="small" type="primary" :click="handleSaveAll">全量保存</AjaxButton>
        <AjaxButton size="small" type="primary" :click="saveInfo">保存</AjaxButton>
      </template>
    </FilterTable>
    <!--抽屉 -->
    <Drawer :visible.sync="visible" :title="dialogTitle" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }"></Drawer>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { getSapPartList, saveBtn } from '@/api/part/inventoryManager/attachmentList';

// import { getAttachmentList } from '@/api/spareparts/basicparams';
// 配件列表主文件
export default {
  name: 'zxWhMainPage',
  mixins: [dictionary],
  data() {
    return {
      topFilterList: this.createTopFilterList(),
      fetchParams: { xhrAbort: false },
      dialogTitle: '',
      fetchApi: getSapPartList,
      columns: this.createTableColumns(),
      handleType: '',
      visible: false,
      formData: [], // table列表数据
      selectData: [],
      selectIndex: [],
      dataSource: [],
      defaultSelections: [],
      tableData: [] // table主数据
    };
  },
  created() {
    // this.findList();
  },
  mounted() {
    // 分页
    // this.BaseTable = this.$refs.table.$refs.pageTable;
    this.changeHandle();
  },
  methods: {
    // 点击搜索
    async changeHandle(val) {
      // this.fetchParams = Object.assign({}, val);
      // this.fetchParams = { ...this.fetchParams };
      this.$refs.table.START_LOADING();
      try {
        let res = await this.fetchApi(val);
        if ((res.resultCode = 200)) {
          this.tableData = res.data;
        }
      } catch (err) {
        this.$refs.table.STOP_LOADING();
        console.log(err, '获取主列表数据');
      } finally {
        this.$refs.table.STOP_LOADING();
      }
    },
    // 创建条件筛选
    createTopFilterList() {
      return [
        {
          type: 'INPUT',
          label: '配件代码',
          fieldName: 'matnr',
          placeholder: '配件代码...'
        }
      ];
    },
    // 创建表单
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 100,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '配件代码',
          dataIndex: 'matnr',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '配件名称',
          dataIndex: 'partName',
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '下发日期',
          dataIndex: 'downDate',
          dateFormat: 'yyyy-MM-dd',
          sorter: true,
          filter: true,
          filterType: 'date-range',
          editable: false,
          editType: 'date-picker'
        },
        {
          title: '下发时间',
          dataIndex: 'downTime',
          dateFormat: 'yyyy-MM-dd',
          sorter: true,
          filter: true,
          filterType: 'date-range',
          editable: false,
          editType: 'date-picker'
        },
        {
          title: '配件销售锁',
          dataIndex: 'zxss1',
          width: 150,
          filter: true,
          editType: 'text'
        },
        {
          title: '替换件代码',
          dataIndex: 'zthj',
          width: 150,
          sorter: true,
          filter: true,
          filterType: 'input'
        },
        {
          title: '替换件销售锁',
          dataIndex: 'zxss2',
          sorter: true,
          filter: true,
          filterType: 'input'
        }
      ];
    },
    collapseHandle() {
      this.$nextTick(() => {
        this.BaseTable.EXECUTE_RESET_HEIGHT();
      });
    },
    // 获取表单数据
    getTableData(val) {
      // console.log(val, 123123);

      this.formData = val;
      this.defaultSelections = val;
    },
    getSelectedData(val) {
      this.selectData = val;
      // console.log('选中行记录', this.selectData);
      // this.selectData.map(item => {
      //   item.isSelected = '10041001';
      // });
    },
    async findList() {
      let res = await getSapPartList();
      if (res.resultCode == 200) {
        // this.defaultSelections.push(res.data);
        this.dataSource = res.data;
      }
    },
    // 保存
    async saveInfo() {
      // console.log(this.formData);
      this.selectData.map(item => {
        item.isSelected = '10041001';
      });
      console.log(this.selectData);
      if (this.selectData.length < 1) {
        return this.$notify.error({ title: '提示信息', message: '请选中一条数据' });
      }
      const res = await saveBtn(this.selectData);
      if (res.resultCode === 200) {
        // 重新加载
        // this.fetchParams = { ...this.fetchParams };
        this.changeHandle();
        return this.$notify({
          title: '提示信息',
          message: res.data.data.message,
          type: 'success'
        });
      } else {
        return this.$notify({
          title: '提示信息',
          message: '保存异常',
          type: 'error'
        });
      }
    },
    // 全选
    selectAll() {
      this.defaultSelections = this.formData.map(item => item);
      // this.defaultSelections = [...this.defaultSelections];
      console.log(this.defaultSelections);
    },
    // 取消全选
    cancelAll() {
      this.defaultSelections = [];
      this.defaultSelections = [...this.defaultSelections];
    },
    // 点击全量保存
    async handleSaveAll() {
      if (this.tableDatal.length) {
        this.tableData.map(item => {
          item.isSelected = '10041001';
        });
        let res = await saveBtn(this.tableData);
        if (res.resultCode == 200) {
          this.$notify({
            title: '提示信息',
            message: res.data.data.message,
            type: 'success'
          });
          this.changeHandle();
        }
      }
    }
  }
};
</script>

<style lang="less" scoped></style>
